<template>
  <view class="main">
    <view class="money">
      <view>1002.33</view>
      <view>在途奖励(元)</view>
    </view>
    <view class="list">
      <view class="item">
        <view class="item_head">
          <view>+10.00</view>
          <view>在途奖励</view>
        </view>
        <view class="item_body">
          <view>李四</view>
          <view>一周内累计购买还差1000元</view>
        </view>
        <view class="item_foot">
          <view>
            <button class="btn btn_remind_Buddy" size="mini" type="default">提醒好友</button>
          </view>
          <view></view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        
      }
    },
    onLoad() {
      this.getData()
    },
    methods: {
      getData() {
        this.$api.mineApi.getTransitRewards({
          page_no: 1,
          page_size: 20
        }).then( res=> {
          console.log("data", res)
        })
      }
    }
  }
</script>

<style lang="scss">
  .border {
    border-bottom: 1px solid #EAEAEA;
  }
  .money {
    background: url(https://asset-uat.bisinuolan.cn/bixuan_uni/images/mine/reward_arrive.png) no-repeat 100%/100%;
    height: 218rpx;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .item_body {
    flex: 2;
    display: flex;
    flex-direction: column;
    padding: 0 20rpx;
  }
  .item {
    display: flex;
    margin: 20rpx;
    padding: 20rpx 0;
  }
  .btn_remind_Buddy {
    background-image: linear-gradient(to right, #020102, #323140);
    color: white;
    border-radius: 4rpx;
  }
  .main {
    background-color: #fff;
  }
</style>
